<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <ul>
    <li>王宝强</li>
    <li class="hot">马宝国
      <span>九连鞭</span>
    </li>
    <li>陈宝国</li>
    <li>光头强</li>
    <li>陈奕迅</li>
    <li>张艺兴</li>
    <li style="display: none;">许嵩</li>
  </ul>
  <h1></h1>
  <script src="./jquery-3.4.1.min.js"></script>
  <script>
    // 1. contains 选择元素内部的文本内容的元素
    $("ul li:contains('强')").css({ color: "red" });
    //2. empty 获取所有空元素
    $(":empty").css({
      width: "200px",
      height: "200px",
      background: "red"
    })
    // 3.:has(选择) 匹配含有选择器所匹配的元素的元素
    $("ul li:has(span)").css({
      background: "red"
    })
    //4. :hidden 获取所有隐藏的元素
    $("ul :hidden").show();
    //5. :visible 获取所有显示的元素
    // $("ul :visible").hide();

  </script>
</body>

</html>